try...catch

try...catch結構可以有效捕獲並處理在長篇代碼的執行過程中發生的錯誤，從而避免程序崩潰或發生不可預期的行為。他允許你「嘗試」執行某段代碼，如果出現錯誤，則「捕獲」這個錯誤並進行處理。

語法:

try {
    // 可能會拋出錯誤的代碼
} catch (error) {
    // 錯誤處理代碼
}

• try：放入可能會引發錯誤的代碼。
• catch：如果try中的代碼出現錯誤，程序會跳到catch中，並將錯誤對象作為參數傳遞給catch。
• error：可以是任意變量名稱，這個變量包含了捕獲到的錯誤信息。

實際看起來會像這樣:

try {
    let result = 10 / 0;
    console.log(result);  // 正常執行
    let num = undefined;
    console.log(num.length);  // 這裡會拋出錯誤，因為 `num` 是 undefined
} catch (error) {
    console.log("發生錯誤:", error.message);  // 捕獲並處理錯誤
}
//輸出結果:
//Infinity
//發生錯誤: Cannot read properties of undefined (reading 'length')

try...catch...finally 結構

finally是可選的，無論是否發生錯誤，finally中的代碼都會在try和catch之後執行，通常用來執行一些清理操作。

語法

try {
    // 可能會拋出錯誤的代碼
} catch (error) {
    // 錯誤處理代碼
} finally {
    // 無論如何都會執行的代碼
}

實際用法:

try {
    let data = "一些數據";
    console.log(data);  // 正常執行
    throw new Error("強制錯誤");
} catch (error) {
    console.log("捕獲錯誤:", error.message);
} finally {
    console.log("這段代碼無論有沒有錯誤都會執行");
}

//輸出結果
//一些數據
//捕獲錯誤: 強制錯誤
//這段代碼無論有沒有錯誤都會執行

捕獲異步錯誤

try...catch無法直接捕捉到異步代碼中的錯誤，因為異步代碼在事件循環的不同階段執行。因此，在處理異步錯誤時，會需要使用Promise或async/await。

• 當使用async/await時，可以在try塊中使用wait來等待異步操作，並在catch塊中捕獲異步操作拋出的錯誤。

function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            reject("伺服器錯誤");
        }, 1000);
    });
}

async function getData() {
    try {
        let data = await fetchData();
        console.log(data);
    } catch (error) {
        console.log("捕獲錯誤:", error);
    } finally {
        console.log("異步操作完成");
    }
}

getData();

//捕獲錯誤: 伺服器錯誤
//異步操作完成

自定義錯誤 (throw)

throw可以手動拋出錯誤，這通常用來檢查函數輸入是否有效，或用來處理自定義錯誤場景。

function checkAge(age) {
    if (age < 18) {
        throw new Error("未成年禁止進入");
    }
    return "歡迎光臨！";
}

try {
    console.log(checkAge(16));  // 這裡會拋出錯誤
} catch (error) {
    console.log("錯誤信息:", error.message);
}

//錯誤信息: 未成年禁止進入